<template>
    <el-row class="statistics">
        <time-filter></time-filter>
         <el-tabs v-model="activeTab" @tab-click="handleClick">
            <el-tab-pane label="本地发件" name="send">
               <span slot="label" class="statistics-tab__label">本地发件</span>
                <echarts-block-send :regions="sendObj.regions" :counts="sendObj.counts"></echarts-block-send>
              </el-tab-pane>
            <el-tab-pane label="本地收件" name="received">
               <span slot="label" class="statistics-tab__label">本地收件</span>
                <echarts-block-received :regions="receivedObj.regions" :counts="receivedObj.counts"></echarts-block-received>
              </el-tab-pane>
        </el-tabs>
    </el-row>
</template>
<script>
import echartsBlock from './echarts-block'
import timeFilter from './time-filter'
import mSearch from '@/base/mixin/m-search'
import {mapState} from 'vuex'
export default {
    mixins: [mSearch],
    components: {
      echartsBlockSend: echartsBlock,
      echartsBlockReceived: echartsBlock,
      timeFilter
    },
    data () {
      return {
        activeTab: 'send'
      }
    },
    computed: {
      ...mapState(['myStatistics_query']),
      sendObj() {
        let list = this.mSearch.sendCount ? this.mSearch.sendCount.list : [];
        console.log(list.map(r => r.dqmc))
        return {
          regions: list.map(r => r.dqmc),
          counts: list.map(r => r.sl)
        }
      },
      receivedObj() {
        let list = this.mSearch.receivedCount ? this.mSearch.receivedCount.list : [];
        console.log(list.map(r => r.dqmc))
         return {
          regions: list.map(r => r.dqmc),
          counts: list.map(r => r.sl)
        }
      }
    },
    watch: {
      myStatistics_query: {
        deep: true,
        immediate: true,
        handler(val) {
          console.log(val)
          this.getCount();
        }
      }
    },
    methods: {
      handleClick(item) {
        console.log(item);
        this.getCount();
      },
      getCount() {
        let type = {send: 1, received: 2}[this.activeTab];
        let query = Object.assign({}, {lb: type}, this.myStatistics_query);
        console.log(query)
        switch(this.activeTab) {
          case 'send':
          console.log(this.getSendCount)
            this.getSendCount(query).then(res => {
                  console.log(this.mSearch.sendCount)
                  console.log(this.mSearch.receivedCount)
            });
          break;
          case 'received':
            this.getReceivedCount(query).then(res => {
                console.log(this.mSearch.sendCount)
                console.log(this.mSearch.receivedCount)
            });
          break;
        }
      }
      // ,
      // myGetSendCount() {
      //   let options = JSON.parse(JSON.stringify(this.options1));
      //   options.xAxis.data = ['广东', '黑龙江'];
      //   options.series[0].data = [100, 500];
      //   this.options1 = options;
      // }
    },
    create() {
      // setTimeout(() => {
      //   this.myGetSendCount()
      // }, 2000)
    }
  }
</script>